<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>番茄小说、QQ阅读、七猫小说 API 接口文档</title>
    <style>
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Arial', sans-serif;
    background-color: #f9f9f9;
    color: #333;
    line-height: 1.6;
    padding: 10px;
}

header {
    background-color: #4CAF50;
    color: white;
    max-width: 60%;
    margin: 20px auto;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    text-align: center;
}

h1 {
    font-size: 2em;
    margin-bottom: 10px;
    text-align: center;
    color: #555;
}

header p {
    font-size: 1.2em;
}

/* 通用盒子样式 */
.stats-box,.button-container,.app-container,.container, section,.warning {
    max-width: 60%;
    margin: 20px auto;
    padding: 20px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 标题样式 */
.stats-box h2,.button-container h2,.container h2,.app-container h2,.api-endpoint h2 {
    margin-bottom: 20px;
    font-size: 20px;
    color: #333;
    font-weight: bold;
    text-align: left;
}
.button-container h2 {
margin-bottom: 0px;
}
.api-endpoint div {
    margin-bottom: 60px;
}
.stat-item {
    margin-bottom: 15px;
    font-size: 18px;
    color: #666;
}

.stat-label {
    font-weight: bold;
    color: #333;
}

/* 按钮容器 */
.button-container {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 15px;
}

button {
    padding: 15px;
    font-size: 18px;
    cursor: pointer;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    width: 100%;
    box-sizing: border-box;
    transition: background-color 0.3s ease;
}

button:hover {
    background-color: #45a049;
}

/* 大屏幕设备优化 */
@media (min-width: 768px) {
   .stats-box,.button-container,.app-container,.container {
        max-width: 60%;
        padding: 15px;
    }

    button {
        width: auto;
        flex: 1;
    }
}

/* 手机端适配 */
@media (max-width: 767px) {
    body {
        padding: 15px;
    }
header {
    max-width: 100%;
}
   .stats-box,.button-container,.app-container,.container,.api-endpoint,.warning {
        max-width: 100%;
        padding: 15px;
    }

   .stat-item {
        font-size: 16px;
    }

    button {
        padding: 12px;
        font-size: 16px;
    }
}



.api-details h3 {
    margin-top: 20px;
    color: #4CAF50;
    font-size: 1.4em;
    margin-bottom: 10px;
}

code {
    background-color: #f4f4f4;
    padding: 10px;
    border-radius: 4px;
    display: block;
    color: #c7254e;
    white-space: pre-wrap;
    word-wrap: break-word;
}

pre {
    background-color: #f9f9f9;
    border-left: 4px solid #4CAF50;
    padding: 10px;
    font-size: 1em;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

table, th, td {
    border: 1px solid #ddd;
}

th, td {
    padding: 12px;
    text-align: left;
}

th {
    background-color: #f4f4f4;
}

tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

footer {
    text-align: center;
    padding: 10px 0;
    background-color: #4CAF50;
    color: white;
    margin-top: 40px;
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
}
footer p a {
    font-size: 1em;
}
/* 媒体查询,用于适配手机端 */
@media (max-width: 600px) {
    header {
        padding: 15px;
        max-width: 100%;
    }

    h1 {
        font-size: 1.8em;
    }



   .api-details h3 {
        font-size: 1.2em;
    }

    code, pre {
        font-size: 0.9em;
    }

    table, th, td {
        font-size: 0.9em;
        padding: 8px;
    }
}

.warning {
    background-color: #FFCC00;
    color: #FF0000;
    font-weight: bold;
    margin-bottom: 20px;
    border-radius: 8px;
    max-width: 100%;
}

.join-chat {
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px;
}

.chat-button {
    display: inline-block;
    background-color: #008CBA;
    color: white;
    padding: 10px 20px;
    font-size: 1.2em;
    text-decoration: none;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease;
}

.chat-button:hover {
    background-color: #005f75;
}

.status-box {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.status-box:last-child {
    border-bottom: none;
}

.label {
    font-weight: bold;
    color: #888;
}

.value {
    font-weight: bold;
    color: #333;
}

.progress-bar {
    width: 100%;
    background-color: #e6e6e6;
    border-radius: 5px;
    overflow: hidden;
    height: 10px;
    margin-top: 5px;
}

.progress {
    height: 10px;
    background-color: #76c7c0;
    border-radius: 5px;
}

/* 搜索容器整体样式 */
.search-container {

    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
    flex-wrap: wrap;
    padding: 0 20px;


}

/* 搜索框样式 */
.search-box {
    flex: 1;
    min-width: 250px;
    padding: 10px;
    border: 2px solid #ccc;
    border-radius: 25px 0 0 25px;
    font-size: 16px;
    outline: none;
    transition: border-color 0.3s ease-in-out;
    max-width: 700px;
}

/* 当搜索框获取焦点时的样式 */
.search-box:focus {
    border-color: #007bff;
}

/* 搜索按钮样式 */
.search-button {
    padding: 10px 20px;
    border: 2px solid #007bff;
    border-left: none;
    background-color: #007bff;
    color: white;
    border-radius: 0 25px 25px 0;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s ease-in-out;
    max-width: 200px;
}

/* 鼠标悬停时按钮颜色变化 */
.search-button:hover {
    background-color: #0056b3;
}

/* 响应式调整 */
@media (max-width: 600px) {
   .search-container {
        flex-direction: column;
        align-items: stretch;
    }

   .search-box {
        margin-bottom: 10px;
        border-radius: 25px;
    }

   .search-button {
        max-width: 100%;
        border-radius: 25px;
    }
}

.yuedu button {
    width: 49.5%;
}

.yuedu p {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    padding: 10px;
    font-size: 14px;
    color: #555;
    border-radius: 5px;
    margin-top: 5px;
}

@media (max-width: 600px) {
   .yuedu button {
        width: 100%;
        margin-top: 10px;
    }
}

/* 通用样式 */
.app-container {
    padding: 20px;
    text-align: center;
}

.app-container a {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 5px;
    margin: 10px 0;
}
/* 致谢 */
h1 {
    margin: 0;
    font-size: 1.5em;
}

.team-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 10px;
}

.team-member {
    background: linear-gradient(135deg, #e0eafc, #cfdef3);
    margin: 10px;
    padding: 10px;
    border-radius: 12px;  /* 调整边角为圆形 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);  /* 阴影效果 */
    text-align: center;
    max-width: 150px;
    width: 100%;
    font-size: 0.9em;
    transition: transform 0.3s ease;  /* 鼠标悬停时的动画效果 */
}

.team-member:hover {
    transform: translateY(-5px);  /* 鼠标悬停时的上移效果 */
}

.team-member img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 10px;
    border: 2px solid #007bff;  /* 为图片添加圆形边框 */
}

.team-member h2 {
    margin: 5px 0;
    font-size: 1.2em;
    color: #007bff;  /* 蓝色标题 */
}

.team-member p {
    margin: 2px 0;
    color: #333;  /* 深灰色文本 */
}

.team {
    color: #ff6347;  /* 番茄红色的链接 */
    text-decoration: none;
    font-size: 0.8em;
}

.team:hover {
    text-decoration: underline;
    color: #ff4500;  /* 悬停时的颜色变化 */
}

@media (max-width: 600px) {
    .team-section {
    max-width: 100%;
}
    .team-member {
        margin: 5px;
        padding: 8px;
        max-width: 45%;
    }

    .team-member img {
        width: 50px;
        height: 50px;
    }

    .team-member h2 {
        font-size: 1em;
    }

    .team-member p, a {
        font-size: 0.7em;
    }
}




/* 手机端样式 */
@media (max-width: 767px) {
   .app-container a {
        font-size: 14px;
        width: 100%;
    }

   .xzyd {
        background-color: rgb(0, 102, 204);
        color: white;
    }

   .xzjj {
        background-color: rgb(255, 75, 66);
        color: white;
    }

   .xzxs {
        background-color: rgb(246, 2, 1);
        color: white;
    }

   .xzmy {
        background-color: #9b59b6;
        color: white;
    }
}

/* 电脑端样式 */
@media (min-width: 768px) {
   .app-container a {
        font-size: 16px;
        width: 100%;
    }

   .xzyd {
        background-color: rgb(0, 102, 204);
        color: white;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

   .xzjj {
        background-color: rgb(255, 75, 66);
        color: white;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

   .xzxs {
        background-color: rgb(246, 2, 1);
        color: white;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

   .xzmy {
        background-color: #9b59b6;
        color: white;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }
}

    #network-chart {
        max-width: 100%; /* 确保图表在移动设备上响应 */
        height: auto;
    }

.welcome-message {
    font-size: 24px;
    font-weight: bold;
    color: #ffffff;
    background: linear-gradient(90deg, #87CEFA, #FFD700); /* 渐变色从浅蓝到金色 */
    padding: 10px 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 柔和的阴影 */
    text-align: center;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2); /* 文字阴影，增强对比度 */
    background-size: 200% 200%;
    animation: gradientAnimation 5s ease infinite;
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}




    </style>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<p class="welcome-message">{{ title }}，欢迎您的使用</p>
<!-- Warning message -->
<div class="warning">
    提示：请勿下载，超限达30次后将永久封禁
</div>
<div class="search-container">
    <input type="text" id="searchQuery" class="search-box" placeholder="请输入搜索书籍或作者...">
    <button id="searchButton" class="search-button">搜索</button>
</div>
<div class="join-chat">
    <a href="/key" class="chat-button">🔑 获取密钥</a>
    <a href="/coffee" class="chat-button">支持一下 ☕</a>
</div>
<div class="join-chat">

    <a href="{{ qqqun }}" target="_blank" class="chat-button">
        📢 QQ群
    </a>
    <a href="{{ tgqun }}" target="_blank" class="chat-button">
        📢 电报群
    </a>
    </div>
<div class="button-container">
    <h2>书源导入</h2>
    <div class="yuedu">
        <button onclick="downloadjijian()">用心读书（苹果）书源</button>
        <button onclick="window.location.href='yuedu://booksource/importonline?src=' + encodeURIComponent(window.location.href) + '/download/yuedu'">阅读/源阅(四件套)</button>
        <p>
    注：本书源目前支持
    <span style="color: red; display: inline-block;">番茄</span>、
    <span style="color: red; display: inline-block;">七猫</span>、
    <span style="color: red; display: inline-block;">得间</span>、
    <span style="color: red; display: inline-block;">QQ</span>、
    <span style="color: red; display: inline-block;">熊猫</span>、
    <span style="color: red; display: inline-block;">起点（69来源）</span>、
    <span style="color: red; display: inline-block;">喜马拉雅</span>的切换。
，导入一共为4件套，分别为：融合版（小说、漫画、听书融合在一起，点击登录切换，操作难度颇高，小白慎用）、纯小说（点击登录可切换搜索源）、纯听书（点击登录可切换搜索源以及音色）、纯漫画（当前仅支持番茄漫画） |  所有书源均需先注册密钥填写密钥后方可使用！</p>
        <button onclick="downloadxiangse()">香色闺阁（苹果）书源</button>
        <p>注：此书源只有核心功能，且密钥需要手动在章节列表的reader接口填写（此书源不随之更新，除非不得已而用之） |  所有书源均需先注册密钥填写密钥后方可使用！</p>
<button onclick="downloadjianrong()">
    其他软件兼容书源
</button>
<p>
    注：此书源兼容-<span style="color: red;">读不舍手</span>、<span style="color: red;">源阅读</span>、<span style="color: red;">千阅</span>、<span style="color: red;">搜书大师</span>，但只有核心功能，且密钥需要手动在章节列表的reader接口填写（此书源不随之更新，除非不得已而用之） | 所有书源均需先注册密钥填写密钥后方可使用！
</p>

    </div>
</div>
<div class="app-container">
    <h2>APP下载</h2>
    <a href="https://wwha.lanzoub.com/iDi9J2c281hi" class="xzyd">下载阅读APP（安卓端）</a>
    <a href="https://apps.apple.com/cn/app/%E6%9E%81%E7%AE%80%E9%98%85%E8%AF%BB%E5%99%A8/id1569793141" class="xzjj">安装用心读书APP（苹果端）</a>
    <a href="https://wwha.lanzoub.com/isU2B2bl7spa" class="xzxs">下载香色闺阁APP（苹果端）</a>
    <a href="https://wwha.lanzoub.com/ixC092c281lc" class="xzmy">下载摸鱼神器（win电脑端）</a>
</div>

<div class="stats-box">
    <h2>数据监控</h2>
    <div class="stat-item">总共请求次数：<span id="total-requests">...</span></div>
    <div class="stat-item">今日请求次数：<span id="today-requests">...</span></div>
    <div class="stat-item">发送流量：<span id="sent-data">...</span>MB</div>
    <div class="stat-item">日期：<span id="date">...</span></div>
</div>
<div class="container">
    <h2>系统监控</h2>

    <div class="status-box">
        <span class="label">CPU使用率</span>
        <span class="value" id="cpu">Loading...</span>
    </div>
    <div class="progress-bar">
        <div class="progress" id="cpu-progress" style="width: 0%;"></div>
    </div>

    <div class="status-box">
        <span class="label">内存使用情况</span>
        <span class="value" id="memory">Loading...</span>
    </div>
    <div class="progress-bar">
        <div class="progress" id="memory-progress" style="width: 0%;"></div>
    </div>

    <div class="status-box">
        <span class="label">网络上行</span>
        <span class="value" id="upload">Loading...</span>
    </div>

    <div class="status-box">
        <span class="label">网络下行</span>
        <span class="value" id="download">Loading...</span>
    </div>

    <!-- 图表 -->
    <canvas id="network-chart" height="250"></canvas>
</div>




<header>
    <h1>{{ title }}- API 接口文档</h1>
    <p>BASE_URL<code>{{ url }}</code></p>
</header>
<section class="api-endpoint">
    <h2>搜索接口</h2>
    <p>说明：该接口用于搜索书籍、听书和漫画。</p>

    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /search              搜索全部</code>
        <code>GET /searchNovel         纯小说</code>
        <code>GET /searchAudio         纯真人听书</code>
        <code>GET /searchCaricature    纯漫画</code>

        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>title</td>
                <td>String</td>
                <td>是</td>
                <td>书籍或作者名称</td>
            </tr>
            </tbody>
        </table>

        <h3>响应示例</h3>
        <pre><code>{
  "code": 0,
  "message": "SUCCESS",
  "data": {
    "book_data": [
      {
        "genre_type": "0",
        "status": "连载中",
        "book_name": "书籍名称",
        "book_id": "书籍id",
        "thumb_url": "封面",
        "audio_thumb_url_hd": "封面",
        "lastChapterTitle": "最后一章标题",
        "read_count": "正在阅读人数",
        "read_count_all": "全部阅读人数",
        "abstract": "简介",
        "author": "作者",
        "tags": "标签",
        "category": "分类",
        "word_number": "字数",
        "score": "评分",
        "last_chapter_update_time": "最后一章更新时间",
        "media": "来源"
      }
    ]
  }
}</code></pre>
    </div>


    <h2>详情接口（仅支持番茄）</h2>
    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /multi_detail</code>


        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>bookId</td>
                <td>String</td>
                <td>是</td>
                <td>书籍ID</td>
            </tr>
            <tr>
                <td>book_name</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>
            <tr>
                <td>author</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>
            <tr>
                <td>thumb_url</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>
            </tbody>
        </table>

        <h3>响应示例</h3>
        <pre><code>{
    "genre": "类型",
    "book_name": "书名",
    "author": "作者",
    "abstract": "简介",
    "thumb_url": "封面",
    "first_chapter_title": "第一章",
    "last_chapter_title": "最后一章",
    "last_chapter_update_time": "最后更新时间",
    "tones": "音色",
    "category": "分类",
    "read_cnt_text": "在读人数",
    "role": "主角",
    "word_number": "字数",
    "book_id": "书籍id"
}</code></pre>
    </div>

    <h2>目录接口</h2>
    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /detail</code>


        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>bookId</td>
                <td>String</td>
                <td>是</td>
                <td>书籍ID</td>
            </tr>
            <tr>
                <td>media</td>
                <td>String</td>
                <td>否</td>
                <td>来源，可忽略</td>
            </tr>
            <tr>
                <td>book_name</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>

            <tr>
                <td>author</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>

            <tr>
                <td>thumb_url</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>

            </tbody>
        </table>

        <h3>响应示例</h3>
        <pre><code>{
  "data": {
    "chapterListWithVolume": [[
        {
          "volume_name": "卷名",
          "firstPassTime": "发布时间",
          "title": "章节标题",
          "itemId": "章节id",
          "media": "来源"
        }
      ]]}
}</code></pre>
    </div>

    <h2>正文接口</h2>
    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /reader</code>


        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>item_id</td>
                <td>String</td>
                <td>是</td>
                <td>章节ID</td>
            </tr>
            <tr>
                <td>key</td>
                <td>String</td>
                <td>是</td>
                <td>密钥</td>
            </tr>
            <tr>
                <td>tone_id</td>
                <td>String</td>
                <td>是</td>
                <td>小说:-1,漫画:-2,真人发音:0,多人发音:51,甜美少女:1,清亮青叔:2,开朗青年:5,温柔淑女:6</td>
            </tr>
            <tr>
                <td>device</td>
                <td>String</td>
                <td>否</td>
                <td>机器码，开通会员必填，普通用户可不填</td>
            </tr>
            <tr>
                <td>media</td>
                <td>String</td>
                <td>否</td>
                <td>来源，可忽略</td>
            </tr>
            <tr>
                <td>book_name</td>
                <td>String</td>
                <td>否</td>
                <td>!无需base64传输，前面已经编码过了，同步历史记录需要</td>
            </tr>
            <tr>
                <td>author</td>
                <td>String</td>
                <td>否</td>
                <td>!无需base64传输，前面已经编码过了，同步历史记录需要</td>
            </tr>
            <tr>
                <td>thumb_url</td>
                <td>String</td>
                <td>否</td>
                <td>!无需base64传输，前面已经编码过了，同步历史记录需要</td>
            </tr>
            </tbody>
        </table>


        <h3>响应示例</h3>
        <pre><code>{
"title": "标题",
"content": "正文"
}
</code></pre>
    </div>


    <h2>发现页接口（仅支持番茄小说）</h2>
    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /discover</code>

        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>id</td>
                <td>String</td>
                <td>是</td>
                <td>分类id：请自行探索</td>
            </tr>
            <tr>
                <td>genre_type</td>
                <td>String</td>
                <td>是</td>
                <td>分类：0：男频，1：女频，160：出版</td>
            </tr>
            <tr>
                <td>offset</td>
                <td>String</td>
                <td>否</td>
                <td>可忽略</td>
            </tr>
                        <tr>
                <td>book_name</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>

            <tr>
                <td>author</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>

            <tr>
                <td>thumb_url</td>
                <td>String</td>
                <td>否</td>
                <td>需要base64编码后传输，同步历史记录需要</td>
            </tr>
            </tbody>
        </table>


        <h3>响应示例</h3>
        <pre><code>{
    "data": [{
            "genre_type": "0",
            "status": "更新状态",
            "book_name": "书名",
            "book_id": "书籍id",
            "thumb_url": 封面地址",
            "audio_thumb_url_hd": "封面地址2",
            "last_chapter_title": "最新章节名称",
            "read_count": "正在阅读人数",
            "read_count_all": "全部阅读人数",
            "abstract": "摘要",
            "author": "作者",
            "tags": "标签",
            "category": "分类",
            "word_number": "字数",
            "score": "评分",
            "last_update_time": "最新更新时间"
             }
            ]
}
</code></pre>
    </div>


    <h2>书架接口</h2>
    <div class="api-details">
        <h3>请求地址</h3>
        <code>GET /bookshelf</code>

        <h3>请求参数</h3>
        <table>
            <thead>
            <tr>
                <th>参数名</th>
                <th>类型</th>
                <th>是否必填</th>
                <th>说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>cookie</td>
                <td>String</td>
                <td>否</td>
                <td>个人账号登录后获取的番茄官方cookie，登录地址：https://fanqienovel.com/</td>
            </tr>
            <tr>
                <td>key</td>
                <td>String</td>
                <td>否</td>
                <td>个人密钥（参数cookie和key二选一不可都不填，也不能都填，cookie番茄书架，key历史记录）</td>
            </tr>

            </tbody>
        </table>


        <h3>响应示例</h3>
        <pre><code>{'data': {'data': [
                {'book_id': '书籍id',
                 'book_name': '书名',
                 'author': '作者',
                 'media': '媒体',
                 'last_chapter_title': '最新章节名/正在阅读章节名',
                 'last_update_time': '更新时间/阅读时间',
                 'thumb_url': '封面'}]},
'code': 0}
</code></pre>
    </div>

</section>
<h1>致谢</h1>


    <section class="team-section">
        <div class="team-member">
            <img src="../static/img/qingtian.png" alt="qingtian">
            <h2>晴天</h2>
            <p>前端开发&接口开发</p>
            <p><a class="team" href="mailto:1085281124@qq.com">1085281124@qq.com</a></p>
        </div>
        <div class="team-member">
            <img src="../static/img/qianshang.png" alt="qianshang">
            <h2>浅殇</h2>
            <p>技术支持&接口逆向</p>
            <p><a class="team" href="mailto:865068376@qq.com">865068376@qq.com</a></p>
        </div>
                <div class="team-member">
            <img src="../static/img/bancan.png" alt="bancan">
            <h2>半残</h2>
            <p>服务器支持</p>
            <p><a class="team" href="mailto:1832579039@qq.com">1832579039@qq.com</a></p>
        </div>
        <div class="team-member">
            <img src="../static/img/ruomi.png" alt="ruomi">
            <h2>若米</h2>
            <p>接口逆向</p>
            <p><a class="team" href="mailto:2705407353@qq.com">dc: jeremy_666</a></p>
        </div>
    </section>
    <footer>

        <p>© 2024 由 <a class="team" href="https://qm.qq.com/q/tuJMFexKBq">晴天</a> 提供技术支持</p>
    </footer>
<script>
        function fetchStats() {
            fetch('/api/stats')
               .then(response => response.json())
               .then(data => {
                    document.getElementById('total-requests').textContent = data.total_requests;
                    document.getElementById('today-requests').textContent = data.today_requests;
                    document.getElementById('sent-data').textContent = data.sent_data.toFixed(2);
                    document.getElementById('date').textContent = data.date;
                })
               .catch(error => console.error('Error fetching stats:', error));
        }

        // 页面加载完成时，立即获取统计数据
        window.onload = function () {
            fetchStats();
            setInterval(fetchStats, 5000); // 每隔 5 秒更新一次数据
        };

function downloadjijian() {
    const url = '/download/jijian';
    initiateDownload(url);
}


function downloadsijiantao() {
    const url = '/download/yuedu';
    initiateDownload(url);
}
function downloadjianrong() {
    const url = '/download/yueducx';
    initiateDownload(url);
}
function downloadxiangse() {
    const url = '/download/xiangse';
    initiateDownload(url);
}

function initiateDownload(url) {
    const a = document.createElement('a'); // 创建一个链接元素
    a.href = url; // 设置链接的 href 属性
    a.download = url.split('/').pop(); // 设置下载文件名
    document.body.appendChild(a); // 将链接添加到文档中
    a.click(); // 触发点击事件
    document.body.removeChild(a); // 下载后移除链接元素
}

document.getElementById("searchButton").addEventListener("click", function(event) {
            // 阻止表单的默认提交
            event.preventDefault();

            // 获取搜索框中的输入值
            const query = document.getElementById("searchQuery").value.trim();

            // 检查是否输入了搜索内容
            if (query === "") {
                alert("请输入搜索内容");
            } else {
                // 跳转到搜索结果页面，并传递搜索参数  在线
                const searchUrl = `online_search?query=${encodeURIComponent(query)}`;
                window.location.href = searchUrl;
            }
        });





</script>
<script>
document.addEventListener('DOMContentLoaded', function() {
    const cpuElement = document.getElementById('cpu');
    const memoryElement = document.getElementById('memory');
    const cpuProgress = document.getElementById('cpu-progress');
    const memoryProgress = document.getElementById('memory-progress');
    const uploadElement = document.getElementById('upload');
    const downloadElement = document.getElementById('download');

    // Chart.js 初始化
    const ctx = document.getElementById('network-chart').getContext('2d');
    const timeLabels = [];
    const uploadData = [];
    const downloadData = [];

    const chart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: timeLabels,
            datasets: [{
                label: '上行速度 (KB/s)',
                data: uploadData,
                borderColor: 'rgba(75, 192, 192, 1)',
                backgroundColor: 'rgba(75, 192, 192, 0.2)',
                fill: true,
                tension: 0.3
            }, {
                label: '下行速度 (KB/s)',
                data: downloadData,
                borderColor: 'rgba(153, 102, 255, 1)',
                backgroundColor: 'rgba(153, 102, 255, 0.2)',
                fill: true,
                tension: 0.3
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: true,
            animation: false, // 禁用动画以提高性能
            scales: {
                x: {
                    display: true,
                    title: {
                        display: true,
                        text: '时间'
                    }
                },
                y: {
                    display: true,
                    title: {
                        display: true,
                        text: '速度 (KB/s)'
                    },
                    beginAtZero: true
                }
            }
        }
    });

    function updateStatus() {
        fetch('/status')
            .then(response => response.json())
            .then(data => {
                // 更新文本和进度条
                cpuElement.innerText = data.cpu_usage + '%';
                memoryElement.innerText = data.memory_usage + '%';
                uploadElement.innerText = data.upload_speed + ' KB/s';
                downloadElement.innerText = data.download_speed + ' KB/s';
                cpuProgress.style.width = data.cpu_usage + '%';
                memoryProgress.style.width = data.memory_usage + '%';

                // 更新图表数据
                const currentTime = new Date().toLocaleTimeString();
                if (timeLabels.length >= 10) {
                    timeLabels.shift(); // 只保留最近 10 个数据
                    uploadData.shift();
                    downloadData.shift();
                }
                timeLabels.push(currentTime);
                uploadData.push(data.upload_speed);
                downloadData.push(data.download_speed);

                chart.update(); // 更新图表
            })
            .catch(error => console.error('Error fetching status:', error));
    }

    // 每 5 秒更新一次，避免过于频繁的请求
    setInterval(updateStatus, 5000);
});

</script>
</body>
</html>
